<script lang="ts" setup>
import { ref } from "vue";

defineOptions({
    name: "Child",
});
//--================= Data
let toy = ref("奥特曼")
let book = ref(10);

//--================= Methods

function minusHouse(parent: any) {
    console.log(parent.house);

    parent.house -= 1;

}

//--================= Other

defineExpose({ toy, book })
</script>

<template>
    <div class="main2">
        <h4>子组件1</h4>
        玩具: {{ toy }} <br>
        书本: {{ book }}


        <button @click="minusHouse($parent)">干掉老爸一套房子</button>

    </div>


</template>

<style scoped>
.main2 {
    background-color: skyblue;
    padding: 10px;
    border-radius: 10px;
    box-shadow: 0 0 10px;
    min-height: 200px;
}
</style>
